﻿@(Html.DevExtreme().DataGrid<DevExtreme.NETCore.Demos.Models.Order>()
    .ID("gridContainer")
    .ShowBorders(true)
    .DataSource(d => d.Mvc().Controller("DataGridSummaries").LoadAction("Get").Key("ID"))
    .Selection(s => s.Mode(SelectionMode.Single))
    .Columns(columns => {
        columns.AddFor(m => m.OrderNumber)
            .Width(130);

        columns.AddFor(m => m.OrderDate)
            .Width(160);

        columns.AddFor(m => m.Employee);

        columns.AddFor(m => m.CustomerStoreCity);

        columns.AddFor(m => m.CustomerStoreState);

        columns.AddFor(m => m.SaleAmount)
            .Alignment(HorizontalAlignment.Right)
            .Format(Format.Currency);
    })
    .Summary(s => s.TotalItems(items => {
        items.AddFor(m => m.OrderNumber)
            .SummaryType(SummaryType.Count);

        items.AddFor(m => m.OrderDate)
            .SummaryType(SummaryType.Min)
            .CustomizeText(@<text>
                function(data) { return "First: " + formatDate(data.value); }
            </text>);

        items.AddFor(m => m.SaleAmount)
            .SummaryType(SummaryType.Sum)
            .ValueFormat(Format.Currency);
        })
    )
)

<script>
    var formatDate = new Intl.DateTimeFormat("en-US", { year: "numeric", month: "short", day: "numeric" }).format;
</script>
